<!DOCTYPE HTML>
<html>
   <head>
   <meta charset="utf-8">
   <title>菜鸟教程(runoob.com)</title>
    
      <script type="text/javascript">
         // 打开一个 web socket
         var ws = new WebSocket("ws://localhost:8001/ws");
               
         ws.onopen = function()
         {
            // Web Socket 已连接上
            document.getElementById("msgs").value = document.getElementById("msgs").value+'已连接...\n';
         };
         ws.onmessage = function (evt) 
         { 
            var received_msg = evt.data;
            document.getElementById("msgs").value = document.getElementById("msgs").value+received_msg+'\n';
         };
         ws.onclose = function()
         { 
            // 关闭 websocket
            document.getElementById("msgs").value = document.getElementById("msgs").value+'连接已关闭...\n';
         };
         function sendMessage() {
            ws.send(document.getElementById("msg").value);
            document.getElementById("msg").value = "";
         }
      </script>
        
   </head>
   <body>
      <div>
         <textarea id="msgs" style="width: 300px; height: 500px; text-align: left;">

         </textarea>
      </div>
      <div id="sse">
         <input type="text" id="msg">
         <a href="javascript:sendMessage()">发送</a>
      </div>
      
   </body>
</html>